<template>
	<el-card class="box-card el-card-flex">
		<div slot="header" class="clearfix">
			<span>
				<i class="el-icon-reading"></i>
				会议室预定
			</span>

		</div>
		<div class="text item">
			<el-form :inline="true" class="demo-form-inline" label-width="100px" @submit.native.prevent>
				<el-form-item label="使用时间">
					<el-date-picker v-model="start1" type="date" style="width:150px" placeholder="选择日期" :picker-options="pickerOptionsS"
					 @change="dataChange">
					</el-date-picker>
				</el-form-item>
				<el-form-item label="会议室类型">
					<el-select v-model="select1" placeholder="请选择" @change="seleChange">
						<el-option v-for="(item,k) in this.seleArr" :key="k" :label="item.rootCatName" :value="item.roomCatId"></el-option>
						<!-- <el-option label="大会议室" value="2"></el-option>
                <el-option label="中会议室" value="3"></el-option>
                <el-option label="小会议室" value="4"></el-option>
                <el-option label="公务车" value="5"></el-option> -->
					</el-select>
				</el-form-item>
				<el-form-item label="" style="float:right">
					<el-button type="primary" :disabled="roomStartTime" @click="handleCli">预定<i class="el-icon-plus"></i></el-button>
				</el-form-item>
			</el-form>
			<div class="el-flex el-box-column ceshi">
				<el-table class="only-table" :data="myDelegateData" border style="width: 100%" height="100%" ref="agentTable"
				 @cell-click="handleCell" @cell-mouse-enter="handMouse" @cell-mouse-leave="handLeave" :cell-style="cellStyle"
				 :row-class-name="tableRowClassName">
					<el-table-column min-width="140px" :show-overflow-tooltip="true" prop="" label="会议室名称">
						<template slot-scope="scope">

							<div class="reserTitle" @click="handleReser(scope.$index,scope.row)">
								<p>
									<span>{{scope.row.roomName}}</span>
									<span>{{scope.row.mebmers}}</span>
								</p>
								<p>
									<span>{{scope.row.positionName}}</span>
									<span v-if="scope.row.price">¥<b style="color:red">{{scope.row.price}}</b>元/小时</span>
								</p>
							</div>
						</template>
					</el-table-column>
					<el-table-column min-width="55px" :show-overflow-tooltip="true" v-for="(item,k) in getTimeArr" :key="k" prop=""
					 :label="item" align="center">
						<template slot-scope="scope">
							<span class="class-timeout" v-if="scope.row.isTimeout == '1'">已超时</span>
							<span class="class-timeout" v-if="scope.row.isTimeout == '2'">已预定</span>
							<span v-if="scope.row.isTimeout == '3'"><i class="el-icon-circle-check"></i></span>
							<span class="class-icon" v-if="clickRow == scope.$index && (roomStartTime == item || roomEndTime == item)"><i
								 class="el-icon-circle-check" style="color:#FFF;font-size:20px"></i></span>
							<span class="class-color" v-if="clickRow == scope.$index && item>roomStartTime && item<roomEndTime"></span>
						</template>
					</el-table-column>
				</el-table>
			</div>
		</div>
		<el-dialog title="会议室详情" :visible.sync="dialogAppVisible" :before-close="handleClose" :close-on-click-modal="false"
		 :close-on-press-escape="false" width="35%">
			<el-form ref="formReser" label-width="150px" :model="formReser">
				<el-form-item label="会议室名称:" prop="name1">
					<el-col :span="16">
						<span>{{formReser.roomName}}</span>
					</el-col>
				</el-form-item>
				<el-form-item label="会议室类型:" prop="type">
					<el-col :span="24">
						<span>{{formReser.rootCatName}}</span>
					</el-col>
				</el-form-item>
				<el-form-item label="容纳人数:" prop="name2">
					<el-col :span="24">
						<span>{{formReser.mebmers}}</span>
					</el-col>
				</el-form-item>
				<el-form-item label="会议室设备:" prop="shebei">
					<el-col :span="24">
						<span>{{formReser.device}}</span>
					</el-col>
				</el-form-item>
				<el-form-item label="会议室环境:" prop="img">
					<el-col :span="24">
						<span>{{formReser.img}}</span>
					</el-col>
				</el-form-item>
			</el-form>

		</el-dialog>
	</el-card>

</template>
<script>
	import $ from "jquery"
	import {
		Dialog,
		Table,
		TableColumn,
		Pagination,
		MessageBox,
		Message,
		Drawer,
		Tabs,
		TabPane,
		Upload
	} from 'element-ui'
	import {
		reservationList, //会议室预定列表
	} from '@/api/conference/reservation.js'
	import {
		categoryList, //会议室类型列表
	} from '@/api/conference/conferenceManage.js'
	import {
		getTime
	} from '@/api/conference/Initialize.js'
	export default {
		name: 'cinferenceType',
		components: {
			'el-dialog': Dialog, // 对话框
			'el-table': Table, // 表格
			'el-table-column': TableColumn, // 表格列
			'el-pagination': Pagination, // 分页
			'el-drawer': Drawer, // 抽屉
			'el-tabs': Tabs, // 标签页
			'el-tab-pane': TabPane, // 标签页列
			"el-upload": Upload, //上传

		},
		data() {
			return {
				clickRow: '',
				roomStartTime: '',
				roomEndTime: '',
				activeName: 'first',
				start1: new Date(),
				select1: "0",
				seleArr: [],
				pickerOptionsS: {
					disabledDate(time) {
						return time.getTime() <= Date.now() - 8.64e7 || time.getTime() > Date.now() + (24 * 60 * 60 * 1000) * 13;
					},
				},
				myDelegateData: [

				],
				dialogAppVisible: false,
				formReser: {
					roomName: '',
					rootCatName: '',
					mebmers: '',
					device: '',
					img: ''
				},
				isShow: true,
				row: {},
				id: '',
				arry: [],
				isTimeout: '',
				getTimeArr: [],
				getCont: 0
			}
		},
		created() {
			categoryList({}).then((res) => {
				if (res.data.code == 10000) {
					this.seleArr = res.data.data.records
					this.seleArr.unshift({
						roomCatId: '0',
						rootCatName: '全部'
					})
				}
			})
			getTime().then((res) => {

				if (res.data.code == 10000) {
					// this.getTimeArr = res.data.data
					let data = res.data.data
					let s = data.startTime.split(':')[0]
					let e = data.endTime.split(':')[0]
					let cont = e - s;
					if (cont <= 1) {
						this.getTimeArr.push(data.startTime)
						// _this.myDelegateData[i].reservationList[j].timeArr.push(_this.myDelegateData[i].reservationList[j].endTime)
					} else {
						this.getTimeArr.push(data.startTime)
						if (data.intervalTime == 2) {
							for (var k = 1; k <= cont; k++) {
								let a = Number(s) + k + 1
								if (a < 10) {
									a = '0' + a
								}
								a = a + ':00'
								this.getTimeArr.push(a)
							}
						} else {
							for (var k = 1; k <= cont; k++) {
								let a = Number(s) + k
								if (a < 10) {
									a = '0' + a
								}
								a = a + ':00'
								this.getTimeArr.push(a)
							}
						}

						// this.fun(cont,_this.myDelegateData[i].reservationList[j].timeArr)
					}
				}
			})
			this.getList()
			window.onresize = () => {
				this.$refs.agentTable.doLayout() //监听窗口变化，重绘表格布局
			}
		},
		methods: {
			//获取列表
			getList() {
				var newD1 = new Date(this.start1)
				var Sy1 = newD1.getFullYear()
				var Sm1 = newD1.getMonth() + 1
				var Sd1 = newD1.getDate()
				let sel = ''
				if (Sd1 < 10) {
					Sd1 = '0' + Sd1
				}
				if (this.select1 == '0') {
					sel = ''
				} else {
					sel = this.select1
				}
				reservationList({
					value: {
						useDate: Sy1 + '-' + Sm1 + '-' + Sd1,
						roomCatId: sel
					}
				}).then((res) => {
					var _this = this
					if (res.data.code == 10000) {
						_this.myDelegateData = res.data.data.records
						for (var i = 0; i < _this.myDelegateData.length; i++) {
							_this.myDelegateData.isTimeout = ''
							if (_this.myDelegateData[i].reservationList.length > 0 && _this.myDelegateData[i].reservationList !== []) {
								for (var j = 0; j < _this.myDelegateData[i].reservationList.length; j++) {
									_this.myDelegateData[i].reservationList[j].timeArr = []
									let s = _this.myDelegateData[i].reservationList[j].startTime.split(':')[0]
									let e = _this.myDelegateData[i].reservationList[j].endTime.split(':')[0]
									let cont = e - s;
									if (cont <= 1) {
										_this.myDelegateData[i].reservationList[j].timeArr.push(_this.myDelegateData[i].reservationList[j].startTime)
										// _this.myDelegateData[i].reservationList[j].timeArr.push(_this.myDelegateData[i].reservationList[j].endTime)
									} else {
										_this.myDelegateData[i].reservationList[j].timeArr.push(_this.myDelegateData[i].reservationList[j].startTime)
										console.log(cont, 'cont111111')
										if (cont >= 2) {
											for (var k = 1; k <= cont - 1; k++) {
												let a = Number(s) + k
												if (a < 10) {
													a = '0' + a
												}
												a = a + ':00'
												_this.myDelegateData[i].reservationList[j].timeArr.push(a)
											}
										} else {
											for (var k = 1; k <= cont; k++) {
												let a = Number(s) + k
												if (a < 10) {
													a = '0' + a
												}
												a = a + ':00'
												_this.myDelegateData[i].reservationList[j].timeArr.push(a)
											}
										}

										// this.fun(cont,_this.myDelegateData[i].reservationList[j].timeArr)
									}
								}
							}
						}

						setTimeout(() => {
							this.$refs.agentTable.doLayout() // 重绘表格宽度，解决表头对不齐的问题
						}, 0)
					}
				})
			},
			//日期发生改变
			dataChange() {
				console.log(this.arry)
				// if(this.arry.length >0){
				//     MessageBox.confirm('您要放弃已选择的会议时间吗？', '提示', {
				//         confirmButtonText: '确定',
				//         cancelButtonText: '取消',
				//         type: 'warning'
				//     }).then(() => {
				this.myDelegateData.forEach((v) => {
					v.meetingDate = this.start1
				})
				//         this.getList()
				//     }).catch(() => {})
				// }


			},
			//类型发生改变
			seleChange() {
				// this.myDelegateData.forEach((v)=>{
				//     v.meetingDate = this.start1
				// })
				this.getList()
			},
			//查看会议室
			handleReser(index, row) {
				this.dialogAppVisible = true;
				let device = []
				if (row.deviceList) {
					row.deviceList.forEach((v) => {
						device.push(v.valName)
					})
				}

				row.device = device.join(',')
				this.formReser = row;
			},
			//关闭
			handleClose() {
				this.dialogAppVisible = false;
			},
			//点击预定按钮
			handleCli() {
				console.log("开始时间:"+this.roomStartTime)
				console.log("结束时间:"+this.roomEndTime)
				this.row.startTime = this.roomStartTime;
				this.row.endTime = this.roomEndTime;
				// if (this.arry.length > 1) {
				// 	this.row.startTime = this.arry[0]
				// 	this.row.endTime = this.arry[this.arry.length - 1]
				// }
				this.giveFuncEvt(this.row)
			},
			/* 添加行索引 */
			tableRowClassName({
				row,
				rowIndex
			}) {
				//把每一行的索引放进row
				row.index = rowIndex
			},
			/* 单元格点击事件 */
			handleCell(row, column, cell, event) {
				if (this.clickRow == row.index) {
					if (this.roomStartTime) {
						if (this.roomEndTime || this.roomStartTime == column.label) {
							this.roomEndTime = ""
							this.roomStartTime = column.label
						} else {
							this.roomEndTime = column.label
						}
					} else {
						this.roomStartTime = column.label
					}
				} else {
					this.clickRow = row.index
					this.roomStartTime = column.label
					this.roomEndTime = ""
				}
				if (this.roomStartTime && this.roomEndTime && this.roomEndTime < this.roomStartTime) {
					let tempTime = this.roomEndTime;
					this.roomEndTime = this.roomStartTime
					this.roomStartTime = tempTime
				}
			},



			//单元格点击
			/* handleCell(row, column, cell, event){
			
			
			
			
			// let cellChecks = $(".class-icon,.class-color")
			// if(cellChecks.length >= 2){
				
			// 	$(".class-icon,.class-color").remove()
			// 	this.arry.splice(0,this.arry.splice.length-1)
			// 	cell.innerHTML = `<span class="class-icon"><i class="el-icon-circle-check" style="color:#FFF;font-size:20px"></span>`
			// 	this.arry.push(column.label)
			// 	return
			// }
            
            let pre = cell.previousElementSibling
            let next = cell.nextElementSibling
            
            let date = new Date();
            let hour1 = date.getHours();
            let minute1 = date.getMinutes();
            let s1 = 0,s2 = 0
            let hour2 = column.label.split(':')[0]
            let min2 = column.label.split(':')[1]
            s1 = Number(hour2*3600)+Number(min2*60)
            s2 = Number(hour1*3600)+Number(minute1*60)

            let y1 = date.getFullYear()
            let m1 = date.getMonth()+1
            let d1 = date.getDate()
            
            let y2 = this.start1.getFullYear()
            let m2 = this.start1.getMonth()+1
            let d2 = this.start1.getDate()
            let c1 = '', c2 = ''
            let arr = []
            c1 = y1+'-'+m1+'-'+d1
            c2 = y2+'-'+m2+'-'+d2
            if((s1 < s2 || column.label == '会议室名称') && (c1 == c2)){
                return false;
            }
            if(row.reservationList.length >0){
               for(let i=0;i<row.reservationList.length;i++){
                   if(row.reservationList[i].timeArr.length>0 || row.reservationList[i].timeArr !== undefined){
                        for(let k=0;k<row.reservationList[i].timeArr.length;k++){
                            if(row.reservationList[i].timeArr[k].split(':')[0] == column.label.split(':')[0]){
                                return false
                                // return 'background:red'
                            }
                        }
                   }
               }
           }
            this.isShow = false;
           
            if(this.arry.length == 0){
                this.id = ''
                this.isShow = false;
            }
            
            if(this.id){
                var rowCell = ''
                if(row.roomId == this.id){
                    cell.innerHTML = `<span class="class-icon"><i class="el-icon-circle-check" style="color:#FFF;font-size:20px"></span>`
                    rowCell = cell
                    
                    this.getCont++
                    row.endTime = column.label
                    row.flag = true
                    row.meetingDate = this.start1
                    this.row = row;
                    let key =this.arry.indexOf(column.label);
                    if(key == 0 || key == this.arry.length-1){
                        cell.innerHTML = ``
                        if(key == 0 && this.arry.length>1){
                            cell.nextElementSibling.innerHTML = `<span class="class-icon"><i class="el-icon-circle-check" style="color:#FFF;font-size:20px"></span>`
                        }else if(key == this.arry.length-1 && this.arry.length>1){
                            cell.previousElementSibling.innerHTML = `<span class="class-icon"><i class="el-icon-circle-check" style="color:#FFF;font-size:20px"></span>`
                        }
                        let a = this.arry.splice(key,1)
                        
                        
                        return false;
                    }else if(key == -1){
                        this.arry.push(column.label)

                    }else{
                        cell.innerHTML = `<span class="class-color"></span>`
                        Message.warning('不可出现断层')
                    }
                    if(this.arry.length == 0){
                        this.id = ''
                        this.isShow = true;
                    }
                    let str = column.label.split(':')[0]
                    let s = this.arry[0].split(':')[0]
                    let e = this.arry[this.arry.length-2].split(':')[0]
                    
                    let cont = 1
                    
                    if(this.arry.length>0){
                        if(str < s){
                            cont = s-str
                            if(cont !== 1 && cont !== 0){
                                let nextFlag = true,nextArr = []
                                for(let i=1;i<cont;i++){
                                    
                                    let a = s-i
                                    if(a <10){
                                        a = '0'+a
                                    }
                                    a = a+':00'
                                    if(row.reservationList.length >0){
                                        for(let j=0;j<row.reservationList.length;j++){
                                            if(row.reservationList[j].timeArr.length>0 || row.reservationList[j].timeArr !== undefined){
                                                for(let k=0;k<row.reservationList[j].timeArr.length;k++){
                                                    if(row.reservationList[j].timeArr[k].split(':')[0] == a.split(':')[0]){
                                                        nextFlag = false
                                                        this.arry.splice(this.arry.length-1,1)
                                                        cell.innerHTML = ``
                                                        Message.warning('该时间段有已预定会议室')
                                                        row.endTime = ''
                                                        // return 'background:red'
                                                    }
                                                }
                                            }
                                        }
                                    }
                                    nextArr.push(a)
                                }
                                if(nextFlag){
                                    for(let i=0;i<nextArr.length;i++){
                                        this.arry.push(nextArr[i])
                                        // next.innerHTML = `<span class="class-color"></span>`
                                        // next = next.nextElementSibling
                                    }
                                }
                            }
                            
                            this.arry.sort()
                            let s1 = this.arry[0].split(':')[0]
                            let e1 = this.arry[this.arry.length-1].split(':')[0]
                            let cont1 = e1-s1
                            for(let i=0;i<cont1-1;i++){
                                next.innerHTML = `<span class="class-color"></span>`
                                next = next.nextElementSibling
                                rowCell = next
                            }
                            
                            // next.innerHTML = `<span class="class-color"></span>`
                        }else if(str > e){
                            cont = str - e
                            if(cont !== 1 && cont !== 0){
                                let flag = true,perArr = []
                                for(let i=1;i<cont;i++){
                                    let a = Number(e)+i
                                    if(a <10){
                                        a = '0'+a
                                    }
                                    a = a+':00'
                                    if(row.reservationList.length >0){
                                        for(let j=0;j<row.reservationList.length;j++){
                                            if(row.reservationList[j].timeArr.length>0 || row.reservationList[j].timeArr !== undefined){
                                                for(let k=0;k<row.reservationList[j].timeArr.length;k++){
                                                    if(row.reservationList[j].timeArr[k].split(':')[0] == a.split(':')[0]){
                                                        flag = false
                                                        this.arry.splice(this.arry.length-1,1)
                                                        cell.innerHTML = ``
                                                        Message.warning('该时间段有已预定会议室')
                                                        row.endTime = ''
                                                    }
                                                }
                                            }
                                        }
                                    }
                                    perArr.push(a)
                                }
                                if(flag){
                                    for(let i=0;i<perArr.length;i++){
                                        this.arry.push(perArr[i])
                                        // pre.innerHTML = `<span class="class-color"></span>`
                                        // pre = pre.previousElementSibling
                                    }
                                    
                                    
                                }
                            }
                            this.arry.sort()
                            let s2 = this.arry[0].split(':')[0]
                            let e2 = this.arry[this.arry.length-1].split(':')[0]
                            let cont2 = e2-s2
                           
                            for(let i=0;i<cont2-1;i++){
                                pre.innerHTML = `<span class="class-color"></span>`
                                pre = pre.previousElementSibling
                                rowCell = pre
                            }
                            
                            // pre.innerHTML = `<span class="class-color"></span>`
                        }
                    }
                    // cell.innerHTML = `<span class="class-icon"><i class="el-icon-circle-check" style="color:#FFF;font-size:20px"></span>`
                    
                }else{
                    console.log(rowCell)
                    // Message.warning('两个会议室不可同时预定')
                    MessageBox.confirm('您要放弃已选择的会议时间吗？', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    })
                    .then(() => {
                        // this.getList()
                    })
                }
            }else{
                this.arry.push(column.label)
                this.id = row.roomId;
                cell.innerHTML = `<span class="class-icon"><i class="el-icon-circle-check" style="color:#FFF;font-size:20px"></span>`
                row.startTime = column.label
                row.endTime = ''
                row.flag = true
                row.meetingDate = this.start1
                this.row = row;
            }
            if(this.arry.length == 0){
                this.id = ''
                cell.innerHTML = ''
            }
                
        }, */
			//鼠标划过
			handMouse(row, column, cell, event) {
				let date = new Date();
				let hour1 = date.getHours();
				let minute1 = date.getMinutes();
				let s1 = 0,
					s2 = 0
				let hour2 = column.label.split(':')[0]
				let min2 = column.label.split(':')[1]
				s1 = Number(hour2 * 3600) + Number(min2 * 60)
				s2 = Number(hour1 * 3600) + Number(minute1 * 60)

				let y1 = date.getFullYear()
				let m1 = date.getMonth() + 1
				let d1 = date.getDate()

				let y2 = this.start1.getFullYear()
				let m2 = this.start1.getMonth() + 1
				let d2 = this.start1.getDate()
				let c1 = '',
					c2 = ''
				c1 = y1 + '-' + m1 + '-' + d1
				c2 = y2 + '-' + m2 + '-' + d2
				if ((s1 < s2 || column.label == '会议室名称') && (c1 == c2)) {
					return false;
				}
				if (row.reservationList.length > 0) {
					for (let i = 0; i < row.reservationList.length; i++) {
						if (row.reservationList[i].timeArr.length > 0 || row.reservationList[i].timeArr !== undefined) {
							for (let k = 0; k < row.reservationList[i].timeArr.length; k++) {

								if (row.reservationList[i].timeArr[k].split(':')[0] == column.label.split(':')[0]) {
									return false
									// return 'background:red'
								}
							}
						}
					}

				}
				// cell.style.background = '#ECF5FF'
				// row.isTimeout = '3';

			},
			//滑过推出
			handLeave(row, column, cell, event) {
				let date = new Date();
				let hour1 = date.getHours();
				let minute1 = date.getMinutes();
				let s1 = 0,
					s2 = 0
				let hour2 = column.label.split(':')[0]
				let min2 = column.label.split(':')[1]
				s1 = Number(hour2 * 3600) + Number(min2 * 60)
				s2 = Number(hour1 * 3600) + Number(minute1 * 60)

				let y1 = date.getFullYear()
				let m1 = date.getMonth() + 1
				let d1 = date.getDate()

				let y2 = this.start1.getFullYear()
				let m2 = this.start1.getMonth() + 1
				let d2 = this.start1.getDate()
				let c1 = '',
					c2 = ''
				c1 = y1 + '-' + m1 + '-' + d1
				c2 = y2 + '-' + m2 + '-' + d2
				if ((s1 < s2 || column.label == '会议室名称') && (c1 == c2)) {
					return false;
				}
				// cell.style.background = 'none'
				// row.isTimeout = '3';
			},
			//改变某一列样式
			cellStyle({
				row,
				column,
				rowIndex,
				columnIndex
			}) {

				let date = new Date();
				let hour1 = date.getHours();
				let minute1 = date.getMinutes();
				let s1 = 0,
					s2 = 0
				let hour2 = column.label.split(':')[0]
				let min2 = column.label.split(':')[1]
				s1 = Number(hour2 * 3600) + Number(min2 * 60)
				s2 = Number(hour1 * 3600) + Number(minute1 * 60)

				let y1 = date.getFullYear()
				let m1 = date.getMonth() + 1
				let d1 = date.getDate()

				let y2 = this.start1.getFullYear()
				let m2 = this.start1.getMonth() + 1
				let d2 = this.start1.getDate()
				let c1 = '',
					c2 = ''
				c1 = y1 + '-' + m1 + '-' + d1
				c2 = y2 + '-' + m2 + '-' + d2
				if ((s1 < s2) && (c1 == c2)) {

					row.isTimeout = '1';
				} else {
					row.isTimeout = '';
				}
				if (c1 == c2) {
					if (row.reservationList.length > 0) {
						for (let i = 0; i < row.reservationList.length; i++) {
							if (row.reservationList[i].timeArr.length > 0 || row.reservationList[i].timeArr !== undefined) {
								for (let k = 0; k < row.reservationList[i].timeArr.length; k++) {
									if (row.reservationList[i].timeArr[k].split(':')[0] == column.label.split(':')[0]) {
										row.isTimeout = '2';
										// return 'background:red'
									}
								}
							}
						}

					}
				}

			},

			// //路由跳转
			/*跳转到新增功能路由组件*/
			giveFuncEvt(row) {
				//this.multiRouters是全局提供的自动添加多级路由的方法
				this.$router.addRoutes(this.multiRouters([{
					path: 'creatReservation',
					name: 'creatReservation', //自定义name名称
					component: () => import('@/views/conference/reservation/creatReservation'),
					meta: {
						title: '会议室预定'
					}
				}]));
				this.$router.push(this.routerMatch({
					name: "creatReservation", //顶部导航+侧边导航
					params: {
						row: row
					}
				}))
			},
		}
	}
</script>
<style lang="scss">
	.el-tab-pane {
		height: 100%
	}

	.reserTitle {
		cursor: pointer;
		padding: 0 10px;
	}

	.reserTitle p span:nth-child(2) {
		float: right;
	}

	.class1 {
		width: 100%;
		height: 62px;
		background: #ccc;
	}

	.only-table .cell {
		padding: 0 !important;
	}

	.ceshi>.el-table--enable-row-hover .el-table__body tr:hover>td {
		background-color: rgba(0, 0, 0, 0);
	}

	.class-timeout {
		background: #F5F7FA !important;
		display: block;
		height: 32px;
		line-height: 32px;
	}

	.class-icon {
		background: #409EFF !important;
		display: block;
		height: 32px;
		line-height: 38px;
	}

	.class-color {
		background: #D9ECFF;
		display: block;
		height: 32px;
		line-height: 32px;
	}
</style>
